import React from 'react';
import { Card, Descriptions } from 'antd';
import PateoSearchForm from '../../../../../components/common/PateoSearchForm';
import moment from 'moment';
import { connect } from 'dva';
import PropTypes from 'prop-types';

@connect((state: any) => ({
  vehicleInfo: state.vehicleInfo,
  loading: state.loading.effects['vehicleInfo/getDataWithRes'],
}))
export default class ReportTab extends React.Component<any, any> {
  constructor(props) {
    super(props);
    this.state = {
      data: '',
    };
  }
  static contextTypes = {
    dicData: PropTypes.any,
  };

  componentDidMount() {
    this.getUrl();
  }
  getUrl() {
    const { vehicleInfo } = this.props;
    const { dispatch } = this.props;
    vehicleInfo.vin
      ? dispatch({
          type: 'vehicleInfo/getDataWithRes',
          payload: {
            url: '/common/bigdata/url',
            dictKey: 'singleReport',
          },
          callback: response => {
            if (response && response.statusCode === '0' && response.data) {
              this.setState({
                data: `${response.data}&VIN=${vehicleInfo.vin}`,
              });
            }
          },
        })
      : '';
  }

  render() {
    return (
      <>
        <iframe
          src={this.state.data}
          style={{ display: 'block', height: 'calc(100vh - 255px)' }}
          // height="calc(100vh)"
          width="100%"
          // scrolling="no"
          frameBorder="0"
        ></iframe>
      </>
    );
  }
}
